export class EnvironmentPanelSimple {
    constructor(container) {
        console.log('EnvironmentPanelSimple: 构造函数开始');
        this.container = container;
        console.log('EnvironmentPanelSimple: 容器设置完成', container);
        
        this.init();
        console.log('EnvironmentPanelSimple: 构造函数完成');
    }

    init() {
        console.log('EnvironmentPanelSimple: 开始初始化');
        this.createPanel();
        console.log('EnvironmentPanelSimple: 面板创建完成');
        this.setupEventListeners();
        console.log('EnvironmentPanelSimple: 事件监听器设置完成');
    }

    createPanel() {
        console.log('EnvironmentPanelSimple: 开始创建面板');
        
        // 创建主面板
        this.panel = document.createElement('div');
        this.panel.className = 'environment-panel';
        this.panel.style.display = 'none';
        this.panel.style.position = 'fixed';
        this.panel.style.top = '50%';
        this.panel.style.left = '50%';
        this.panel.style.transform = 'translate(-50%, -50%)';
        this.panel.style.background = 'white';
        this.panel.style.border = '1px solid #ccc';
        this.panel.style.padding = '20px';
        this.panel.style.zIndex = '1000';
        
        console.log('EnvironmentPanelSimple: 面板元素创建完成', this.panel);
        
        this.panel.innerHTML = `
            <h3>简单测试面板</h3>
            <button id="closePanel">关闭</button>
            <button id="testButton">测试按钮</button>
        `;
        
        // 添加到容器
        this.container.appendChild(this.panel);
        console.log('EnvironmentPanelSimple: 面板已添加到容器');
    }

    setupEventListeners() {
        console.log('EnvironmentPanelSimple: 开始设置事件监听器');
        console.log('EnvironmentPanelSimple: this.panel =', this.panel);
        
        if (!this.panel) {
            console.error('EnvironmentPanelSimple: 错误 - this.panel 为 null');
            return;
        }
        
        // 关闭按钮
        const closeBtn = this.panel.querySelector('#closePanel');
        if (closeBtn) {
            closeBtn.addEventListener('click', () => {
                this.hide();
            });
            console.log('EnvironmentPanelSimple: 关闭按钮事件设置成功');
        }
        
        // 测试按钮
        const testBtn = this.panel.querySelector('#testButton');
        if (testBtn) {
            testBtn.addEventListener('click', () => {
                alert('测试按钮点击成功！');
            });
            console.log('EnvironmentPanelSimple: 测试按钮事件设置成功');
        }
    }

    show() {
        if (this.panel) {
            this.panel.style.display = 'block';
            console.log('EnvironmentPanelSimple: 面板显示');
        }
    }

    hide() {
        if (this.panel) {
            this.panel.style.display = 'none';
            console.log('EnvironmentPanelSimple: 面板隐藏');
        }
    }

    toggle() {
        if (this.panel) {
            if (this.panel.style.display === 'none') {
                this.show();
            } else {
                this.hide();
            }
        }
    }
}